import React from 'react';
import {connect} from 'dva';
import {withRouter} from 'dva/router';
import {Layout} from '../../../components';
import {filterText} from '../../../utils/content';
import {Divider, Tag,Button,Modal,message} from 'antd';
const {Filter, DataTable,Topic,Loading} = Layout;
const {channelManageText} = filterText;
const confirm = Modal.confirm;

function startConfirm() {
    confirm({
      title: '确定要启用该渠道吗？',
      centered:true,
    //   className:'confirm',
      onOk() {
        console.log('OK');
      },
      onCancel() {
        console.log('Cancel');
      },
    });
}
function stopConfirm() {
    confirm({
      title: '确定要停用该渠道吗？',
      centered:true,
    //   className:'confirm',
      onOk() {
        console.log('OK');
      },
      onCancel() {
        console.log('Cancel');
      },
    });
}

const tableHeadAction={
    btn:  <Button onClick={()=>{message.info('This is a normal message');}}>订单导出</Button>
}
const filterProps = {
    filterText: channelManageText,
    placeholder:'搜索  商户订单号、会员名称、申请编号'
}
function ChannelManage({children, channelManage , dispatch, location, history}) {
    const {data, page,totalAmount} = channelManage;
    const columns = [
        {
            title: '渠道编号',
            dataIndex: 'channelCode',
        }, {
            title: '渠道名称',
            dataIndex: 'channelName',
        }, {
            title: '状态',
            dataIndex: 'status',
            render:(data,row)=>{
                if (data == "10") {
                    return <Tag color='green'>启用</Tag>;
                } else if (data == "20") {
                    return <Tag color='red'>停用</Tag>;
                }
                return "未知";
            }
        }, {
            title: '计费方式',
            dataIndex: 'feeType',
            render: (data,row) => {
                if (data == "10") {
                    return "交易笔数";
                } else if (data == "20") {
                    return "交易金额";
                }
                return "未知";
            }
        }, {
            title: '费率',
            dataIndex: 'fee',
        }, {
            title: '费率说明',
            dataIndex: 'feeDesc',
        }, {
            title: '操作人',
            dataIndex: 'lastmodifiedByName',
        }, {
            title: '更新时间',
            dataIndex: 'lastmodifiedTime',
        }, {
            title: '操作',
            render: (data,row) => {
                let statusBtn;
                const toDetail=()=>{
                    history.push({
                        pathname:'/basicCenter/channelManageDetail',
                        search:`id=${row.id}`
                    })
                }
                
                if(row.status == "10"){
                    statusBtn = <a href="javascript:;" onClick={stopConfirm}>停用</a>;
                }else if(row.status =="20"){
                    statusBtn = <a  href="javascript:;"  onClick={startConfirm}>启用</a>;
                }
                return (
                    <span>
                        {statusBtn}
                        <Divider type="vertical"/>
                        <a href="javascript:;" onClick={toDetail}>详情</a>
                    </span>
                )
            }
        }
    ];
    const tableProps={
        data,
        page,
        columns,
        totalAmount,
        tableHeadAction,
        showTableHead:true
    }
    return (
        <div>
            <Topic title="渠道管理"/>
            <Filter {...filterProps}/>
            <DataTable {...tableProps}/>
        </div>
    )
}

export default withRouter(connect(({channelManage }) => ({channelManage }))(ChannelManage));
